//登录
let toke = localStorage.getItem("token");
if (toke) {
  let unlogin = document.querySelector("#unlogin");
  unlogin.style.display = "none";
  let logined = document.querySelector("#logined");
  logined.style.display = "block";
}
// 添加收货地址
let tj=document.querySelector(".tj #btn_pay_address_add");
let popup=document.querySelector("#popup_pay_address");
tj.onclick=function(){
popup.style.display='block';
}
//点击叉号弹出框消失
let popupClose=document.querySelector('.popup-close');
popupClose.onclick=function(){
  popup.style.display='none';
}
//地址确定按钮点击事件
let btnSure=document.querySelector(".btn-sure");
btnSure.onclick=function(){
  let recName=document.querySelector("#recName").value;
  let cityName=document.querySelector(".selected").innerHTML;
  let address=document.querySelector("#address").value;
  let iphone=document.querySelector("#iphone").value;
  let fixCall=document.querySelector("#fixCall").value;
  let postalCode=document.querySelector("#postalCode").value;
  let html=`
  <li class="on" cityName="${cityName}" fixCall="${fixCall}"  postalCode="${postalCode}" addressid="2781916">
              <span>${recName}</span>
              <p class="address">${address}</p>
              <p class="fl mr30">${iphone}</p>
              <a href="javascript:;" class="tx js_pay_address_edit"></a>
              <a href="javascript:;" class="gb js_pay_address_del"></a>
            </li>
  `
  let ul=document.querySelector(".address-list .clearfix");
  if(ul.querySelector(".on")){
    ul.querySelector(".on").classList.remove("on");
  }
  // ul.querySelectorAll(".on").forEach((v)=>{
  //   v.classList.remove("on");
  // })
  ul.innerHTML=html+ul.innerHTML;
  popup.style.display='none';   
  //重新绑定添加地址点击事件
  let tj=document.querySelector(".tj #btn_pay_address_add");
  tj.onclick=function(){
    popup.style.display='block';
    }
    //删除地址事件
    let addDel=document.querySelectorAll(".js_pay_address_del");
    addDel.forEach(function(v){
      v.onclick=()=>{
       let f=v.parentElement.parentElement;
       f.removeChild(v.parentElement);
      }
    })
    let lastphone=document.querySelector(".on .mr30").innerHTML;
    let lastname=document.querySelector(".on span").innerHTML;
    let lastaddress=document.querySelector(".on .address").innerHTML;
    let htmls=`
    <li class="t3">寄送至： ${lastaddress} </li>
            <li class="t2">收货人：${lastname} ${lastphone}</li>
    `
    document.querySelector("#blk_pay_total .clearfix").innerHTML+=htmls;
}
loadCartList()
//渲染订单商品列表
let cartArr = [];
async function loadCartList() {
  // 解构 出data属性
  let { data } = await myAxios.get(cartListAPI);
  cartArr = [...data.data];
  
  // 根据数据 渲染列表
  renderList();
}
function renderList() {
  let liArrs=location.search;
  liArrs=liArrs.split("=")[1].split(",");
  let liArr = cartArr.map((v) => {
    // console.log(v);
  // console.log(liArrs);
  // console.log(v.product.id);
if(liArrs.some((item)=>item==v.product.id)){
   return `
    <tr>
                  <td>
                    <div class="img">
                      <div>
                        <a href="/cf/detail.shtml?id=23109" target="_blank">
                          <img src="http://192.168.18.95:1337${v.product.coverImage}"
                            width="113" height="108">
                        </a>
                      </div>
                    </div>
                  </td>
                  <td class="td-1">
                    <span>
                      <a href="/cf/detail.shtml?id=23109" target="_blank">${v.product.name}</a>
                    </span>
                  </td>
                  <td class="td-2">
                    <span class="col">款式: 标准版</span>
                  </td>
                  <td>
                    <span>${v.price}.00 元</span>
                  </td>
                  <td>
                    <span class="lastAmount" id="${v.product.id}">
                      ${v.amount}
                    </span>
                  </td>
                  <td>
                    <b>
                    ${v.price*v.amount}.00 元
                    </b>
                  </td>
                </tr>
        `;
} 
  });
  document.querySelector(".order-details table tbody").innerHTML += liArr.join("");
let sumPrice=0;
let bprice=document.querySelectorAll(".order-details table tbody b");
 bprice.forEach((v)=>{
  let lisum=v.innerHTML.split(".")[0].trim();
  // console.log(lisum);
  sumPrice+=lisum-0;
 });
// console.log(sumPrice);
let totalsum=document.querySelectorAll("#blk_pay_total .clearfix li");
totalsum[1].innerHTML=sumPrice.toFixed(2)+"元";
totalsum[11].querySelector("b").innerHTML=sumPrice.toFixed(2)+"元";
}

//提交订单
let btn_pay_submit=document.querySelector("#btn_pay_submit");
btn_pay_submit.onclick=async function(){
// let tr=document.querySelectorAll(".order-details table tbody tr");
// let products=[];
// tr.forEach((v)=>{
// let spans=v.querySelector(".lastAmount");
// let obj={};
// obj.product=spans.id-0;
// obj.amount=spans.innerHTML.trim()-0;
// products.push(obj); 
// })
// products=JSON.stringify(products);
// console.log(products);
// let receiver=document.querySelector(".on span").innerHTML;
// let address=document.querySelector(".on .address").innerHTML;
// // console.log(receiver,address);
// let res=await myAxios.post(ordersAPI,{products,receiver,address});
// console.log(res);


alert("提交订单成功，将在您点击确定后跳转页面");
setTimeout(function(){
  location.href="./productlist.html";
})
}